<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
  <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  <link rel="stylesheet" href="../../css/animate.css">
  <link rel="stylesheet" href="../../iconfont/iconfont.css">
  <link rel="stylesheet" href="../../css/mescroll.css">
  <link rel="stylesheet" href="../../css/gloab.css">
  <title>绑定账户信息</title>
  <style>
    .none-order{
      text-align: center;
      color:#727272;
      line-height: 200%;
      margin-top: 1rem;
    }
    .mescroll{
      position: fixed;
      top: 0;
      bottom: 0;
      height: auto; /*如设置bottom:50px,则需height:auto才能生效*/
    }
    .zz-img{
      width:2.5rem;
      margin:0 auto;
      background:#eee;
      height:2.5rem;
      padding:auto;
      border:1px solid #dedede;
      border-radius:0.05rem;
    }
    .zz-img img{
      width:1rem;
      margin-left:0.75rem;
      margin-top:0.3rem;
    }
    .zz-img div{
      text-align:center;
      line-height:0.45rem;
      height:0.45rem;
      margin-top:0.35rem;
      font-size:0.3rem;
      color:#999;
    }
    .zz-content{
      width:90%;
      height:0.45rem;
      line-height:0.45rem;
      text-align:center;
      margin:0.25rem auto;
      font-size:0.25rem;
      color:#999;
    }
    .zz-image{
      width:2.65rem;
      height:2.65rem;
      margin:auto;
      background: #eee;
      border-radius: 50%;
      overflow: hidden;
    }
    .zz-image img{
      width:100%;
      height: 100%;
    }
    .zz-images{
      width:85%;
      height:3rem;
      margin:0.2rem auto;
      background: #eee;
      /*overflow: hidden;*/
    }
    .zz-img-button-list{
      width:85%;
      height:1rem;
      margin:auto;
      line-height: 1rem;
    }
    .zz-img-button-list div{
      width:30%;
      float: left;
      font-size: 0.3rem;
    }
    .zz-img-button-list img{
      width:20%;
      line-height: 1rem;
      margin-top: 0rem;
      padding-top:0.2rem;
    }
    .zz-img-button-list span{
      margin-top: 0rem;
      font-size: 0.3rem;
    }
    .zz-images img{
      width:100%;
      height: 100%;
    }
    .zz-title{
      width:85%;
      height:0.45rem;
      line-height: 0.45rem;
      margin:0 auto 0.25rem;
      font-size: 0.3rem;
    }
    .zz-button{
      width:60%;
      height:0.65rem;
      text-align: center;
      background: #3b8bff;
      line-height: 0.65rem;
      margin:1rem auto;
      color:#fff;
      border-radius: 0.08rem;
    }
  </style>
</head>
<body>
  <div id="app">
    <div id="public-header">
      <div id="statusbar"></div>
      <header class="public-header">
        <div class="public-header-lf iconfont icon-fanhui" @click="javascript:api.closeWin();"></div>
        <div class="public-header-title">绑定账户信息
        </div>
        <!-- <div class="public-header-text" @click="javascript:api.openWin({name: 'fahongbao',reload:true,url:'../home/fabu.html',});">我要发红包</div> -->
      </header>
    </div>
    <div class="dating-body auto" style="padding-bottom:0.5rem;margin-top:1rem;">
      <div class="zz-title" v-if="names">
        当前账户姓名：{{names}}
      </div>
      <div class="zz-title" v-else>
        当前账户姓名：未添加
      </div>
      <div class="zz-title" style="border-bottom:1px solid #999;padding-bottom:0.15rem;">
        <input type="text" v-model="name" placeholder="请输入真实姓名">
      </div>
      <div class="zz-title" v-if="alipay_accounts">
        当前支付宝账号：{{alipay_accounts}}
      </div>
      <div class="zz-title" v-else>
        当前支付宝账号：未添加
      </div>
      <div class="zz-title" style="border-bottom:1px solid #999;padding-bottom:0.15rem;">
        <input type="text" v-model="alipay_account" placeholder="请输入支付宝账号">
      </div>
          <div class="zz-button" @click="updateName">确认绑定</div>
      <div class="public-progress" style="z-index:9;">
      <img src="../../icon/icon150x150.png" alt="" class="animated infinite flash" style="width:200px;height:200px;display:block;margin:200px auto;">
      </div>
    </div>
  </div>

</body>
<script src="../../script/api.js"></script>
<script src="../../script/jquery.js"></script>
<script src="../../script/mescroll.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/jsencrypt.js"></script>
<script src="../../script/fastclick.js"></script>

<script>
var vm;
var mescroll;
var mySwiper;
apiready=function(){
  api.removeLaunchView();
  setBar("statusbar");
  setFont(750);
  startVue();
  // NewMescroll();
  var top=$("#public-header").outerHeight(true)+$("#nav").outerHeight(true);
  $("#mescroll").css({"top":top+"px"});
  $(".public-progress").fadeOut(1000);
  setTimeout(function(){
    $(".public-progress").css({"display":"none"});
  },1000);
}
function startVue(){
  vm = new Vue({
    el:"#app",
    data:{
      name:'',
      names:'',
      alipay_accounts:'',
      alipay_account:'',
    },
    created:function(){
      this.getAccount();
    },
    mounted:function(){
    },
    methods:{
      getAccount:function(){
        api.ajax({
            url: apiUrl+'api/user/checkAccount',
            method: 'post',
            data: {
                values: {
                  token:$api.getStorage('token'),
                },
            }
        },function(ret, err){
            if (ret.code==1) {
              vm.names = ret.data['alipay_name'];
              vm.alipay_accounts = ret.data['alipay_account'];
            } else {
              vm.names = '';
              vm.alipay_accounts = '';
            }
        });
      },
      updateName:function(){
        if (vm.name=="") {
          msg('请输入账户姓名');
          return;
        }
        if (vm.alipay_account=="") {
          msg('请输入支付宝账号');
          return;
        }
        api.ajax({
            url: apiUrl+'/api/user/updateAccount',
            method: 'post',
            data: {
                values: {
                  token:$api.getStorage('token'),
                  alipay_name:vm.name,
                  alipay_account:vm.alipay_account,
                },
            }
        },function(ret, err){
			console.log(JSON.stringify(ret))
            if (ret.code==1) {
              msg('绑定成功');
              setTimeout(function(){
                api.closeToWin({
                    name: 'root'
                });
                api.execScript({
                    name: 'root',
                    script:'qhSelect(0);'
                });
              },1000)
            } else {
              msg(ret.msg);
            }
        });

      },

    }
  })
}


</script>
</html>
